<template>
    <div>
        <el-card class="body">
            <!-- 顶部的面包屑导航 -->
            <el-breadcrumb separator-class="el-icon-arrow-right" style="font-size: 16px;">
                <el-breadcrumb-item :to="{ path: '/' }"><i class="el-icon-s-promotion"></i>四叶草医生</el-breadcrumb-item>
                <el-breadcrumb-item >患者管理</el-breadcrumb-item>
            </el-breadcrumb>
            <el-divider content-position="left"></el-divider>

            <!-- 操作区域 -->
            <div>
                <el-divider content-position="left">操作区域</el-divider>
                <el-button @click="gotoAddNew()" size="small">开处方</el-button>
            </div>

            <el-divider content-position="left">数据表格</el-divider>
            <el-table :data="patientList">
                <el-table-column prop="doctor" label="医生姓名" width="80" align="center"></el-table-column>
                <el-table-column prop="user" label="患者姓名" width="80" align="center"></el-table-column>
                <el-table-column prop="age" label="患者年龄" width="80" align="center"></el-table-column>
                <el-table-column prop="gender" label="患者性别" width="80" align="center"></el-table-column>
                <el-table-column prop="description" label="病症信息" width="150" align="center"></el-table-column>
                <el-table-column prop="medicine" label="药品信息" width="150" align="center"></el-table-column>
                <el-table-column prop="isPaid" label="是否付款" width="80" align="center">
                    <template slot-scope="scope">
                        {{ scope.row.isPaid === 0 ? '未付款' : '已付款' }}
                    </template>
                </el-table-column>
                <el-table-column prop="allergy" label="过敏史" width="130" align="center"></el-table-column>
                <el-table-column prop="medicHistory" label="药品历史" width="120" align="center"></el-table-column>
                <el-table-column prop="visitDate" label="就诊日期" width="150" align="center"></el-table-column>
                <el-table-column label="操作" align="center" width="150">
                    <template slot-scope="scope">
<!--                        <el-button type="primary" icon="el-icon-edit" size="mini" circle
                                   @click="openEditDialog(scope.row)"></el-button>-->
                        <el-button type="danger" icon="el-icon-delete" size="mini" circle
                                   @click="openConfirmDialog(scope.row)"></el-button>
                    </template>
                </el-table-column>
            </el-table>

            <!-- 分页控件 -->
            <div class="block" style="float: right;margin: 10px 0 10px 0">
                <el-pagination
                    @current-change="changePage"
                    :page-size="pageSize"
                    :current-page="currentPage"
                    layout="total, prev, pager, next"
                    :total="total">
                </el-pagination>
            </div>

            <!-- 修改药品信息的弹出窗口 -->
            <el-dialog title="收货地址" :visible.sync="editFormDialogVisible">
                <el-form :model="editForm" label-width="120px">
                    <el-form-item label="患者姓名">
                        <el-input v-model="editForm.name"></el-input>
                    </el-form-item>
                    <el-form-item label="收货地址">
                        <el-input v-model="editForm.address"></el-input>
                    </el-form-item>
                </el-form>
                <div slot="footer" class="dialog-footer">
                    <el-button @click="editFormDialogVisible = false">取 消</el-button>
                    <el-button type="primary" @click="submitEditForm()">确 定</el-button>
                </div>
            </el-dialog>
        </el-card>
    </div>
</template>

<script>
import BaseUrl from "@/http/BaseUrl";
import TokenAxios from "@/http/TokenAxios";

export default {
    data(){
        return{
            editFormDialogVisible :false,
            editForm:[],
            patientList : [],
            // 分页相关数据
            currentPage: this.$router.currentRoute.query.page ? parseInt(this.$router.currentRoute.query.page) : 1,
            pageSize: 20,
            total: 0,
        }
    },
    methods: {
        gotoAddNew() {
            this.$router.push('/order/doc/addNew');
        },
        loadCurrentLoginInfo(){
            this.loginInfo=JSON.parse(localStorage.getItem('loginInfo'));
        },
        openConfirmDialog(prescription){
            let message = '将删除【' + prescription.id +'】在您的账号上的显示的数据，是否继续？';
            this.$confirm(message, '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                this.handleDelete(prescription);
            }).catch(() => {
            });
        },
        handleDelete(prescription){
            let url = BaseUrl.PRESCRIPTION_DOCTOR+'/doc/prescription/' + prescription.id + '/delete';
            console.log('url = ' + url);

            TokenAxios.post(url).then((response) => {
                let jsonResult = response.data;
                if (jsonResult.state === 20000) {
                    this.$message({
                        message: '删除成功！',
                        type: 'success'
                    });
                    this.loadPresList();
                } else if (jsonResult.state === 40400) {
                    this.$alert(jsonResult.message, '错误', {
                        confirmButtonText: '确定',
                        callback: action => {
                            this.loadPresList();
                        }
                    });
                } else {
                    this.$alert(jsonResult.message, '错误', {
                        confirmButtonText: '确定',
                        callback: action => {
                        }
                    });
                }
            });
        },

        // 切换分页
        changePage(page) {
            this.$router.replace('?page=' + page);
            this.loadUserList();
        },
        loadPresList(){
            let page = this.$router.currentRoute.query.page;
            if (!page) {
                page = 1;
            }
            let patientUrl=BaseUrl.PRESCRIPTION_DOCTOR+'/doc/prescription/patientList?page='+page;
            console.log('url = ' + patientUrl);
            TokenAxios.get(patientUrl).then((response)=>{
                let jsonResult=response.data;
                if (jsonResult.state===20000){
                    this.patientList=jsonResult.data.list;
                    this.currentPage = jsonResult.data.pageNum;
                    this.pageSize = jsonResult.data.pageSize;
                    this.total = jsonResult.data.total;
                }
            })
        }
    },
    created() {
        this.loadPresList();

    },
    mounted() {
        this.loadCurrentLoginInfo();

    }
}
</script>